import { Component, OnInit, OnDestroy, Renderer2, ElementRef } from '@angular/core';
import { NavParams } from '@ionic/angular';
import { DataService } from '@services/data.service';
import { ActivatedRoute } from '@angular/router';
import { CacheService } from '@services/cache.service';

@Component({
  selector: 'fire-others',
  templateUrl: 'fire-others.html',
  styleUrls: ['fire-others.scss']
})
export class FireOthersPage implements OnInit, OnDestroy {
  typeData;            // 获取其他房间基础数据及参数
  projectId;           // 项目Id
  alarmInfos;          // 告警信息
  autoScrollInterval;  // 告警滚动定时器


  constructor(
    // public navParams: NavParams,
    public dataService: DataService,
    public renderer: Renderer2,
    public el: ElementRef,
    public activatedRoute: ActivatedRoute,
    public cacheService: CacheService
  ) {
    this.projectId  = this.cacheService.currentProject.projectId ? this.cacheService.currentProject.projectId : 0;
    this.getFireOther(this.projectId);
  }

  ngOnInit() {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad DevicePage');
  }

  /**
   * 获取其他房间基础数据及参数
   * @param projecetId
   */

  getFireOther(projecetId) {
    this.dataService.getFireDevices(projecetId, 3).subscribe(res => {
      this.typeData = res.data.otherDetailInfo;
      for (let i = 0; i < res.data.otherAlarmInfoList.length; i++) {
        res.data.otherAlarmInfoList[i].alarmTime = res.data.otherAlarmInfoList[i].alarmTime.
        substr(0, res.data.otherAlarmInfoList[i].alarmTime.length - 4);
      }
      this.alarmInfos = res.data.otherAlarmInfoList;
      for (const data of this.typeData) {
        for (const members of data.deviceDetialInfo) {
          for (let k = 0; k < members.params.length; k++) {
            if (members.params[k].roundCount >= 0) {
              members.params[k].value = members.params[k].value
                ? parseFloat(members.params[k].value).toFixed(members.params[k].roundCount)
                : members.params[k].value;
            }
            if (members.params[k].parameterName === '手自动状态') {
              members.isPen = members.params[k];
              members.params.splice(k, 1);
            }
          }
        }
      }
      this.autoScroll(this.alarmInfos.length);
    });
  }

  // 告警滚动
  autoScroll(len) {
    const step = -90;
    let top = 1;
    const ele = this.el.nativeElement.querySelector('.Text-init');
    if (this.autoScrollInterval) {
      clearInterval(this.autoScrollInterval);
      this.renderer.setStyle(ele, 'transition', 'unset');
      this.renderer.setStyle(ele, 'top', 0 + 'px');
    }
    this.autoScrollInterval = setInterval(() => {
      if (top < len) {
        this.renderer.setStyle(ele, 'top', top * step + 'px');
        if (top === 1) {
          this.renderer.setStyle(ele, 'transition', 'top 1s');
        }
        top++;
      } else {
        top = 0;
        this.renderer.setStyle(ele, 'transition', 'unset');
      }
    }, 2000);
  }

  ngOnDestroy() {
  }
}
